<!DOCTYPE HTML>
<html>
<head>
<title>Services</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Instyle Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href='https://fonts.googleapis.com/css?family=Julius+Sans+One' rel='stylesheet' type='text/css'>
<script src="js/jquery.min.js"></script>
<script src="js/responsiveslides.min.js"></script>
<script>
    $(function () {
      $("#slider").responsiveSlides({
      	auto: true,
      	nav: true,
      	speed: 500,
        namespace: "callbacks",
        pager: true,
      });
    });
	
  </script>
</head>
<body>
<!-- banner -->
<div class="header">
		<div class="banner-1">	
			<div class="container">
				<div class="header-left">
		<div class="sidebar">
		 <div class="logo">
				<h1><a href="index.html"><span class="log">I</span>INSTYLE</a></h1>		 
		 </div>
		<div class="top-navigation">
				

				<div class="t-img">
					<img src="images/menu.png" alt="" />
				</div>
				<div class="clearfix"> </div>
		</div>
		
		<div class="drop-navigation">
			 <div class="top-menu">
				 
				<ul class="cl-effect-16">
					<li><a href="index.html" data-hover="HOME">HOME</a></li>
					<li><a href="about.html" data-hover="ABOUT">ABOUT</a></li>
					<li class="active"><a href="services.html" data-hover="SERVICES">SERVICES</a></li>
					<li><a href="style.html" data-hover="STYLE">STYLE</a></li>
					<li><a href="shortcodes.html" data-hover="SHORT CODES">SHORT CODES</a></li>
					<li><a href="contact.html"data-hover="CONTACT">CONTACT</a></li>
				</ul>	 		 
			 </div>
			<!-- script-for-menu -->
							<script>
								$( ".top-navigation" ).click(function() {
								$( ".drop-navigation" ).slideToggle( 300, function() {
								// Animation complete.
								});
								});
							</script>
			
			 <div class="side-btm">
				 <div class="social-icons">
						<ul class="social">
						<li><a href="#"><i></i></a> </li>
						<li><a href="#"><i class="facebook"></i></a></li>	
						<li><a href="#"><i class="google"></i> </a></li>						
					</ul>
						<div class="clearfix"></div>
				 </div>
				
			 </div>
		</div>
		<div class="clearfix"> </div>
</div>
		
	</div>
			</div>
		</div>
		
	<div class="clearfix"> </div>
	
</div>
<!-- banner -->
<!-- services -->
	<div class="services">
		<div class="container">
			<div class="col-md-4 services-left">
				<h3>Services List</h3>
				<ul>
					<li><a href="#"><span></span>Entire soul, the release </a></li>
					<li><a href="#"><span></span>I enjoy with my whole </a></li>
					<li><a href="#"><span></span>Lorem Ipsum is the release  </a></li>
					<li><a href="#"><span></span>Entire soul, the release </a></li>
					<li><a href="#"><span></span>I enjoy with my whole </a></li>
					<li><a href="#"><span></span>Lorem Ipsum is the release  </a></li>
					<li><a href="#"><span></span>Entire soul, the release </a></li>
					<li><a href="#"><span></span>I enjoy with my whole </a></li>
					<li><a href="#"><span></span>Lorem Ipsum is the release  </a></li>
				</ul>
			</div>
			<div class="col-md-8 services-right">
					<h3>Services Overview</h3>
				<div class="col-md-6 ser-lft">
					<img src="images/pi2.jpg" class="img-responsive" alt="">
					<h4>Vestibulum iac.</h4>
					<p>Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi.</p>
				</div>
				<div class="col-md-6 ser-lft">
					<img src="images/pi3.jpg" class="img-responsive" alt="">
					<h4>Laculis est. </h4>
					<p>Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi.</p>
				</div>
					<div class="clearfix"></div>
				<div class="ser-btm">
					<div class="col-md-6 ser-lft">
						<img src="images/pi4.jpg" class="img-responsive" alt="">
						<h4>Proin dictu.</h4>
						<p>Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi.</p>
					</div>
					<div class="col-md-6 ser-lft">
						<img src="images/pi5.jpg" class="img-responsive" alt="">
						<h4>Dictum elementu</h4>
						<p>Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi.</p>
					</div>
						<div class="clearfix"></div>
				</div>
			</div>
				<div class="clearfix"></div>
		</div>
	</div>
<!-- services -->

<!-- open -->
	<div class="open">
		<div class="container">
			<div class="col-md-6 open-left">
				<div class="col-md1 ">
					<a href="#" class="b-link-stripe b-animate-go  thickbox">
						<img src="images/24.jpg" class="img-responsive" alt="">
							<div class="b-wrapper">
								<h3 class="b-animate b-from-top top-in1   b-delay03 ">
										
								</h3>
							</div>
					</a>
				</div>
			</div>
			<div class="col-md-3 open-right">
				<div class="col-md1 ">
					<a href="#" class="b-link-stripe b-animate-go  thickbox">
						<img src="images/11.jpg" class="img-responsive" alt="">
							<div class="b-wrapper">
								<h3 class="b-animate b-from-top top-in1   b-delay03 ">
									
								</h3>
							</div>
					</a>
				</div>
			</div>
			<div class="col-md-3 open-mid">
				<img src="images/11.jpg" class="img-responsive" alt="">
				<h5>Established fact</h5>
				<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
				<a class="hvr-shutter-in-horizontal" href="#">More</a>
			</div>
				<div class="clearfix"></div>
		</div>
	</div>
<!-- open -->
<!-- footer -->
	<div class="footer">
		<div class="container">
			<div class="footer-top">
				<div class="col-md-4 footer-grid">
				<h4>Decoline</h4>
				<p class="flan">443 Flanigan Oaks Drive<span>
					Alexandria, MD 22304</span></p>
				<p>Phone : <label>+1 234 567890</label></p>
				<p>Mail: <a href="mailto:info@example.com">info@example.com</a></p>
				

				</div>
				<div class="col-md-5 footer-grid-top ">	
					<h4>Newsletter</h4>
						<div class="enter">
						<form>
							<input type="text" value=" Email" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email';}">	
							<input type="submit" value="">
						</form>	
						</div>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. 
<span>Excepteur sint occaecat cupidatat non proident, suntin culpa qui officia deserunt</span></p>						
				</div>
				<div class="col-md-3 footer-grid-bottom ">
					<h4>Follow us :</h4>
					<ul class="social">
						<li><a href="#"><i></i></a> </li>
						<li><a href="#"><i class="facebook"></i></a></li>
						<li><a href="#"><i class="linkedin"></i> </a></li>		
						<li><a href="#"><i class="google"></i> </a></li>						
					</ul>
				</div>
				
				<div class="clearfix"> </div>
			</div>
				<p class="footer-class">Copyright &copy; 2015.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
		</div>
		
	</div>
<!-- footer -->
</body>
</html>